<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

	<head>
		<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />

		<link rel="stylesheet" href="__STATIC__/css/hdjs.css" />
		<link rel="stylesheet" href="__VIEW__/css/style.css" />
		<link rel="stylesheet" href="__VIEW__/css/commonjs.css" />
		<link rel="stylesheet" href="__VIEW__/css/details.css" />
		<link rel="stylesheet" href="__VIEW__/css/index.css" />
		<script src="__STATIC__/js/jquery-1.7.2.min.js"></script>
		<script src="__STATIC__/js/hdjs.min.js"></script>
		<script type="text/javascript">
			var ajaxStock = "{|U:'ajaxStock'}";
			var ajaxCart = "{|U:'Cart/addCart'}";
			var showCart = "{|U:'Cart/ajaxGoods'}";
			var app = "{|U:'Details/index'}";
			var delCart = "{|U:'Cart/delCart'}";
			var root = "__ROOT__/";
			var loading = "__STATIC__/Img/loading.gif";
			var ajaxQa = "{|U:'ajaxQa'}";
			var ajaxComm = "{|U:'ajaxComm'}";
			var gid = "{$hd.get.gid}";
		</script>
		<script type="text/javascript" src="__VIEW__/js/addCart.js"></script>
		<script type="text/javascript" src="__VIEW__/js/ajaxGoodsNum.js"></script>
		<script src="__VIEW__/js/magnifier.js"></script>
		<script src="__STATIC__/js/common.js"></script>
		<script src="__VIEW__/js/showCart.js"></script>
		<script type="text/javascript" src="__VIEW__/js/ajaxPage.js"></script>
		<link rel="stylesheet" href="__STATIC__/css/animate.css" />
		<script type="text/javascript">
			$(function(){
				var islogin = 0;
				$('.imgList li').mouseenter(function(){
					var index = $(this).index();
					//显示中图
					$('.smallImg').find('img').eq(index).show().siblings('img').hide();
					//显示大图
					$('.rightImg').find('img').eq(index).show().siblings('img').hide();
				});
				
				$('.proShow').find('img').css({'display':'inline'});
				
				//先判断是否登陆
					$.ajax({
						url:"{|U:'ajaxIsLogin'}",
						dataType:'json',
						type:'get',
						success:function(phpData){
							if(phpData.status){
								islogin = 1;
								
							}else{
								islogin = 0;
							}
						}
					})
				
				
				//qaBtn 判断是否登陆
				$('#qaBtn').live('click',function(){
					if(islogin){
						$('.qaform').show();
					}else{
						hd_alert({
									message:'您还未登陆,请先登陆',
									timeout:3
								})
					}
					})
					
				
				
				//提交要提问的内容
				$('#dosubmit').click(function(){
					//先判断是否登陆
					if(islogin){
						var questcontent = $('#questcontent').val();
						if(!questcontent){
							hd_alert({
								message:'请输入要提问的内容',
								timeout:3
							});
							return false;
						}
						var data = $('#questfrom').serialize();
						//如果登陆后那么将提问的内容发送到php端
						$.ajax({
							url:"{|U:'addQeust'}",
							data:data,
							dataType:'json',
							type:'post',
							success:function(phpData){
								if(phpData.status){
									hd_alert({
										message:phpData.message,
										timeout:3
									})
									$('.qaform').hide();
								}else{
									hd_alert({
										message:phpData.message,
										timeout:3
									})
								}
							}
							
						})
					}else{
						hd_alert({
							message:'您还没有登陆',
							timeout:3
						})
					}
				})
				/**
				 * ajax提交一个评论
				 */
				$('#commentsubmit').click(function(){
					var data = $('#commform').serialize();
					$.ajax({
						url:"{|U:'Comment/addComment'}",
						data:data,
						type:'post',
						dataType:"json",
						beforeSend :function(){
							$('#commform').parents('div').html('提交中<img src="__STATIC__/Img/loading.gif" />');
						},
						success:function(phpData){
							if(phpData.status){
								hd_alert({
									message:phpData.message,
									timeout:3
								});
								var str = '<div class="commentDesc"><div class="leftStr"><div class="commentStr">';
								    str += '<p>'+phpData.data.gc_content+'</p>';
									str += '<p class="time">';
									str += phpData.data.gc_time;
									str += '</p></div></div><div class="rightType"><ul>';
									str += '<li>颜色：'+phpData.data.combinestr[0]+'</li>';
									str += '<li>尺码：'+phpData.data.combinestr[1]+'</li>';
									str += '<li>身高：'+phpData.data.gc_height+'cm</li>';
									str += '<li>体重：'+phpData.data.gc_weight+'kg</li>';
									str += '<li class="isok">';
									str += '<'+phpData.data.gc_tag+'></li></ul></div>';
									str += '<div class="member"><p>';
									str += '<a href="javascript:;" class="username">';		
									str += phpData.data.username + '<span class="vipIcon"></span>';
									str += '</a></p></div></div>';
									$('.comments').prepend(str);
									$('#commentBox').addClass('animated fadeOutUp');
							}else{
								hd_alert({
									message:phpData.message,
									timeout:3
								})
							}
						}
					})
				})
				/**
				 *  关闭评论窗口 
				 */
				$('#closewindow').click(function(){
					$('#commentBox').addClass('fadeOutUp',function(){
						$(this).hide();
					});
				})
				/**
				 * 判断用户是否购物了此件商品如果购买那么才让用户评论否则 不给评论
				 */
				$('#commentBtn').click(function(){
					//如果登陆过了再判断是否已经评论过
					if(islogin){
						$.ajax({
							url:"{|U:'Comment/isBuyComm'}",
							data:{gid:'{$hd.get.gid}'},
							dataType:'json',
							type:'get',
							success:function(phpData){
								if(phpData.status){
									$('#commentBox').show();
									$('#commentBox').removeClass('fadeOutUp');
									$('#commentBox').addClass('fadeInUp');
								}else{
									hd_alert({
										message:phpData.message,
										timeout:3
									})
								}
							}
					})
					}else{
						hd_alert({
							message:'您还未登陆,请先登陆',
							timeout:3
						})
					}
					
				})
				
				
			})
		</script>

		<style>
			.nothot{
				color:#727171 !important;
			}
			table{
        		font-size:14px;
        		color:#555;
        		text-align: right;
        		margin:0 auto;
    		}
    		h3{
    			font-size:13px;
    			color:#B1B1B1;
    		}
		</style>
		<title>{$goods.goods.goods_name}</title>
	</head>

	<body>
		<!-- 头部开始  -->
		<include file="__VIEW__/Public/head" />
		<!-- 头部结束  -->

		<!--内容-->
		<div id="content">
			<div class="title">
				<div class="mbx">
					<a href="{|U:'Index/index'}">首页</a> >
					<foreach from="$mbx" key="$mk" value="$mv">
						<a href="{|U:'Category/index',array('cid'=>$mv['cid'])}">{$mv.cname}</a> >
					</foreach>
					<span style="color:#B81B22">{$goods.goods.goods_name}</span>
				</div>
				<!--商品标题-->
				<div class="proTitle">
					<div class="left">
						<h1>

			 			{$goods.goods.goods_name}

			 			

			 			</h1>
					</div>
					<div class="right">
						<a href="#proShow">产品描述</a>
						<a href="#commentCenter">评论</a>
						<a href="#qa" style="border:none;">提问</a>
					</div>
				</div>
				<!--商品标题结束-->
			</div>
			<!--商品区-->
			<div class="proArea">
				<!--左边图片展示区-->
				<div class="left">
					<div class="imgList">
						<span class="arrow">

							<!--<a href="" class="upArrow"></a>-->

						</span>
						<ul>
							<foreach from="$goods.details.smallimg" key="$gimgk" value="$gimg">
								<li class="active">
									<img src="__ROOT__/{$gimg}" alt="" />
								</li>
							</foreach>

						</ul>
						<span class="arrow">

							<!--<a href="" class="downArrow"></a>-->

						</span>
					</div>
					<!--大图展示区-->
					<div class="bigImg" style="position: relative;">
						<!--放大镜中的小图-->
						<div class="smallImg">
							<!--放大镜图层-->
							<div class="layer"></div>
							<!--放大镜图层结束-->
							<div class="box"></div>
							<foreach from="$goods.details.mediumimg" key="$mimk" value="$mimg">
								<if value="$mimk==0">
									<img src="__ROOT__/{$mimg}" alt="" />
									<else/>
									<img src="__ROOT__/{$mimg}" alt="" style="display:none;" />
								</if>
							</foreach>
						</div>
						<!--大图片-->
						<div class="rightImg">
							<foreach from="$goods.details.bigimg" key="$bimk" value="$bimg">
								<if value="$bimk==0">
									<img src="__ROOT__/{$bimg}" alt="" />
									<else/>
									<img src="__ROOT__/{$bimg}" alt="" style="display:none;" />
								</if>
							</foreach>
						</div>
						<!--大图片结束-->
					</div>
					<!--大图展示区-->
				</div>
				<!--左边图片展示区结束-->
				<!--右边价格区-->
				<div class="right">
					<div class="priceArea">
						<!--商品价格-->
						<div class="priceTitle">
							<p>
								售价：￥<span>{$goods.goods.shop_price}</span>
							</p>
						</div>
						<!--商品颜色-->

						<if value="$goods.goods.goods_count">
							<foreach from="$goods.goodsspec._attrname" key="$key" value="$val">
								<div class="proColor">
									<span style="float:left">{$val}：</span>
									<div class="colorThumb">
										<ul>
											<foreach from="$goods.goodsspec" key="$kk" value="$vv">
												<if value="$vv.attrname==$val">
													<li value="{$vv.attid}"><span class="proName">{$vv.attr_value}</span><span class="arrow"></span>
													</li>
												</if>
											</foreach>
										</ul>
									</div>
								</div>
							</foreach>
							<div class="proMsg" style="margin-top:30px;">
							</div>
							<!--商品尺码-->
							<!--<div class="proSize">
							<span>尺码：</span>
							<ul>
								<li data-size="s">S</li>
								<li data-size="s">M</li>
								<li data-size="s">L</li>
								<li data-size="s">XL</li>
							</ul>
						</div>-->
							<!--数量-->

							<div class="proCount">
								<form action="javascript:;" method="post" id="buy">
									<input type="hidden" name="price" value="{$goods.goods.shop_price}" />
									<span>数量：</span>
									<!--购买数量-->
									<select name="goodscount" id="">
										<option value="1">1</option>
										<option value="2">2</option>
										<option value="3">3</option>
										<option value="4">4</option>
										<option value="5">5</option>
										<option value="6">6</option>
										<option value="7">7</option>
										<option value="8">8</option>
										<option value="9">9</option>
										<option value="10">10</option>

									</select>
							</div>
							<!--已选-->
							<div class="currentSelect">
								<span>已选：</span>
								<strong></strong>
								<strong class="isStork">总库存{$goods.goods.goods_count}</strong>
							</div>
							<!--按钮组-->
							<div class="btnArea">
								<!--<form action="{|U:'Cart/shopConfirm'}" method="post" >-->
								<input type="hidden" name="goodsname" value="{$goods.goods.goods_name}" />
								<input type="hidden" name="combine" value="" />
								<input type="hidden" name="combinestr" value="" />
								<input type="hidden" name="goodsimg" value="{$goods.goods.goods_listimg}" />
								<input type="hidden" name="gid" value="{$goods.goods.gid}" />
								<!--<input type="submit" value="立即购买" id="nowBuy" />-->

								<a href="javascript:;" id="addCart"></a>
								</form>

								<div class="cartMsg">
									<p class="msgtitle">
										<span class="titleleft">商品已成功放入购物车</span>
										<span class="titleright"></span>
									</p>
									<div class="cartcontent">
										<div class="contentleft">
											<p class="lefticon"></p>
											<div class="lefttext">
												<div class="top">
													共有<span class="count"></span>件商品
												</div>
												<div class="bottom">
													总计<span class="countmoney"></span>元
												</div>
											</div>
										</div>
										<div class="contentright">
											<div class="keepshop">
												<a href="javascript:;">
													<<继续购物</a>
											</div>
											<div class="gocart">
												<a href="{|U:'Cart/index'}">去购物车>></a>
											</div>
										</div>
									</div>
								</div>
							</div>
							<else />
							<div>【对不起此商品目前缺货^_^】</div>
						</if>
						<!--提示-->
						<!--<div class="prompt">
							<p>
								<strong>优惠提示</strong>
							</p>
							<ul>
								<li style="list-style-type: ;">
									此款参与购物满199元免运费活动 
								</li>
							</ul>
						</div>-->
					</div>
				</div>
				<!--右边价格区-->
				<!--产品展示区-->
				<div class="proShow" name="desc" id="proShow">
					<!--产品描述-->
					<!--<div class="desc">
						<h4>
							产品描述：
						</h4>
						<p>
							100%全棉青年布面料，款式复刻经典二战美军舰艇机械师工装款，采用美棉（孟菲斯州），竹节纱的加入，既保留了面料适度的粗糙质感，亦适合打造春夏清爽造型。修身版型，每个细节都以毫米为单位调整，更加适合外穿。靛蓝染料的独特褪色效果是其魅力所在。 
						</p>
					</div>-->
					<!--产品属性-->
					<div class="proProperty">
						<h4>

							产品属性：(点击属性可查看同类商品)

						</h4>
						<!--属性列表-->
						<div class="proList">
							<ul>
								<foreach from="$goods.goodsattr" key="$ak" value="$avl">
									<li><span>{$avl.attrname}：</span>{$avl.attr_value}</li>
								</foreach>

							</ul>
						</div>
					</div>
					<!--洗涤说明-->
					<!--<div class="washMan">
						<h4>	
							洗涤说明：
						</h4>
						<ul>
							<li class="washImg1"></li>
							<li class="washImg2"></li>
							<li class="washImg3"></li>
							<li class="washImg4"></li>
							<li class="washImg5"></li>
							<li class="washImg6"></li>
						</ul>
					</div>-->
					{$goods.details.intro}

				</div>
				<!--产品展示区结束-->
			</div>
			<!--商品区结束-->
			<!--商品评论区-->
			<div class="comment">
				<div class="hotPro fr">
					<h4>

						热销商品

					</h4>
					<ul>
						<foreach from="$hotgoods" key="$hk" value="$hgoods">
							<li>
								<a href="{|U:'Details/index',array('gid'=>$hgoods['goods_gid'])}">
									<img src="__ROOT__/{$hgoods.goods_listimg}" width="160" height="160" alt="" />
								</a>
								<div class="proTitle">
									<p class="proName"><a href="{|U:'Details/index',array('gid'=>$hgoods['goods_gid'])}">{$hgoods.goods_name|hd_substr:14,''}</a>
									</p>
									<a href="" class="proPrice">售价￥{$hgoods.shop_price} </a>
								</div>
							</li>
						</foreach>
					</ul>
				</div>
				<!--评论中心-->
				<div class="commentCenter" id="commentCenter">
					<h4 class="title">最新评论(共<span class="commCount">{$total2}</span>条)</h4>
					<!--评论标签-->
					<div class="top">
						
						<!--评论按钮-->
						<div class="commentBtn">
							<a href="javascript:;" id="commentBtn">我要评论</a>
						</div>
					</div>
					<!--评论内容-->
					<div class="clearfix"></div>
					<!--评论内容-->
					<div class="comments">
						<!--评论内容-->
						<if value="$comments">
						<foreach from="$comments" key="$ck" value="$cv">
						<div class="commentDesc">
							<!--左边字符串-->
							<div class="leftStr">
								<div class="commentStr">
									<p>{$cv.gc_content}</p>
									<p class="time">
										{$cv.gc_time}
									</p>
								</div>
							</div>
							<!--右边购买的型号-->
							<div class="rightType">
								<ul>
									<li>颜色：{$cv.combinestr.0}</li>
									<li>尺码：{$cv.combinestr.1} </li>
									<li>身高：{$cv.gc_height}cm</li>
									<li>体重：{$cv.gc_weight}kg</li>
									<li class="isok">
										<{$cv.gc_tag}>
									</li>
								</ul>
							</div>
							<!--会员信息-->
							<div class="member">
								<p>
									<a href="javascript:;" class="username">

										{$cv.username}

										<span class="vipIcon"></span>

									</a>
								</p>
							</div>
						</div>
						</foreach>
						<else/>
						<div style="padding:20px;">目前没有评论</div>
						</if>
					</div>
					<!--评论分页-->
					<div class="commentPage">
						{$page2}
					</div>
					<!--评论分页结束-->
				</div>
				<!--商品提问区-->
				<div class="qa" id="qa">
					<div class="title">
						最新提问 (共<span class="qaCount">{$total}</span>条)
					</div>
					<!--问答头部-->
					<div class="qaTop">
						<a href="javascript:;" class="qaBtn" id="qaBtn">

							我要提问

						</a>
					</div>
					<if value="empty($quest)">
						<div class="qaStr">
							<!--提问内容-->
							<div class="qaStrs">
								目前此商品没有提问
							</div>

						</div>
						<else/>
						<div id="qacontent">
							<foreach from="$quest" key="$qk" value="$qv">
								<!--详细提问列表-->
								<div class="qaStr">
									<!--提问内容-->
									<div class="qaStrs">
										<div class="q">
											<span class="qstr">Q</span> {$qv.username|hd_substr:6,'***'}：
										</div>
										<span class="quest">{$qv.quest_content}</span>
										<span class="answer">

								<a href=""></a>

							</span>
										<span class="times">{$qv.quest_time|date:'Y/m/d H:i:s',@@}</span>
										<div class="clearfix"></div>
										<!--回复-->
										<div class="a">
											<span class="qstr">A</span> {$qv.answer}
										</div>
									</div>

								</div>

							</foreach>
					</if>
					<div class="qapage" >
						{$page}
					</div>
					</div>
					
					<!--qa分页-->

				</div>
				<!--提问框 -->
				<div class="qaform">
					<div class="title">
						<p>提问:{$goods.goods.goods_name}</p>
					</div>
					<p class="titlebottom"></p>
					<div class="fromcenter">
						<form action="javascript:;" id="questfrom">
							<input type="hidden" name="goods_gid" id="goods_gid" value="{$goods.goods.gid}" />
							<input type="hidden" name="users_uid" value="{$hd.session.uid}" />
							<div class="form-group">
								<label for="quesecontent">提问内容:</label>
								<textarea name="quest_content" id="questcontent" placeholder="请输入提问内容"></textarea>
							</div>
							<div class="form-group">
								<label for="">&nbsp;</label>
								<a href="javascript:;" id="dosubmit"></a>
							</div>

						</form>

					</div>

				</div>
			</div>

		</div>
		
		<div id="commentBox"  style="display: none;" class="animated">
			<div class="title">
				<div class="title">
					<p class="ptitle">评论:{$goods.goods.goods_name} <a href="javascript:;" id="closewindow">[关闭]</a>
					</p>
				</div>
				<p class="titlebottom"></p>
			</div>
			<div class="frommain">
				<form action="javascript:;" id="commform" >
					<input type="hidden" name="goods_gid" id="goods_gid" value="{$hd.get.gid}" />
					<input type="hidden" name="users_uid" id="users_uid" value="{$hd.session.uid}" />
					<div class="form-group">
						<label for="gc_height">身高:</label>
						<input type="text" name="gc_height" id="gc_height" value="" placeholder="输入身高" /><span class="unit">单位:CM</span>
					</div>
					<div class="form-group">
						<label for="gc_weight">体重:</label>
						<input type="text" name="gc_weight" id="gc_weight" value="" placeholder="输入体重" /><span class="unit">单位:KG</span>
					</div>
					<div class="form-group">
						<label for="gc_tag">标签:</label>
						<label for="tag1">
							<input id="tag1" type="radio" name="gc_tag" value="尺码合适" checked="checked" />尺码合适</label>
						<label for="tag2">
							<input id="tag2" type="radio" name="gc_tag" value="尺码偏小" />尺码偏小</label>
						<label for="tag3">
							<input id="tag3" type="radio" name="gc_tag" value="尺码偏大" />尺码偏大</label>
						<label for="tag4">
							<input id="tag4" type="radio" name="gc_tag" value="偏色" />偏色</label>
					</div>
					<div class="form-group" style="margin-top:30px;">
						<label for="gc_weight">评论内容:</label>
						<textarea name="gc_content" placeholder="请输入评论内容"></textarea>

					</div>
					<div class="form-group" style="margin-top:60px;">
						<label for="">&nbsp;</label>
						<input type="submit" class="submit" id="commentsubmit" value="" />
					</div>

				</form>
			</div>
		</div>
		<!--内容-->
		<script type="text/javascript">
			$('#commform').validate({
				gc_height:{
					rule:{
						required:true,
						num:'100,300',
					},
					error:{
						required:'请输入您的身高',
						num:'请输入一个数字'
					},
					message:'请输入您的身高',
					success:'输入正确'
				},
				gc_weight:{
					rule:{
						required:true,
						num:'1,300',
					},
					error:{
						required:'请输入您的体重',
						num:'请输入一个数字'
					},
					message:'请输入您的体重',
					success:'输入正确'
				},
				gc_content:{
					rule:{
						required:true,
						minlen:5,
						maxlen:100,
					},
					error:{
						required:'请输入评论内容',
						minlen:'不少于5个字符',
						maxlen:'不大于100个字符',
						
					},
					message:'请输入评论内容',
					success:'输入正确'
				}
			})
		</script>

		<!-- 页脚开始 -->
		<include file="__VIEW__/Public/foot.html" />
		<!-- 页脚结束 -->

	</body>

</html>